<template>
  <div style="background-color: white;height: 100%">
    <div>
      <van-nav-bar
          left-arrow
          @click-left="onClickLeft"
      />
    </div>
    <div style="margin: 30px 0">
      <van-icon name="checked" size="5rem" color="#02cc02"/>
      <br>
      <span style="font-size: 25px">充值成功</span>
    </div>
    <div>
      <van-cell title="充值说明" :value="topupMsg.rechargeChannels==1 ? '微信支付' : (topupMsg.rechargeChannels==2 ? '支付宝支付' : '贝宝支付')" style="text-align: left"/>
      <van-cell title="充值金额" :value="topupMsg.rechargeAmount+'₱'" style="text-align: left"/>
    </div>
    <div style="margin: 80px 0">
      <van-button class="but" round plain hairline type="info" @click="onClickLeft">完成</van-button>
      <van-button class="but" style="border: 0;margin-bottom: 10px" round type="default" @click="gotopupdetail">查看详情</van-button>
    </div>
  </div>
</template>

<script>
import axios from "axios";

export default {
  data() {
    return {
      topupMsg:{}
    }
  },
  mounted() {
    let orderId = this.$route.query.orderId;
    if(orderId!=null||orderId!=''){
      this.gettopupMsg(orderId)
    }
  },
  methods: {
    onClickLeft() {
      this.$router.push({
        path: 'topup',
      })
    },
    gotopupdetail(){
      this.$router.push({
        path: '/topupdetail',
        query:{
          id:this.topupMsg.id
        }
      })
    },
    gettopupMsg(orderId){
      axios.get('http://localhost:11219/mine/topup/gettopupmsg/'+orderId).then(res=>{
        console.log(res.data)
        this.topupMsg=res.data
      })
    }
  }
}
</script>

<style  scoped>
.but{
  width: 90%;
  margin: 5px 0;
}
.but::before{
  background-color:transparent!important;
}
</style>
